﻿import * as React from "react";
import * as electron  from 'electron'
import * as $ from  'jquery'
import * as Css from '../../工具代码/Css加载'
import 颜色 from '../../工具代码/颜色'

let ipcR = electron.ipcRenderer
Css.加载(module.filename)

export default class R链接 extends React.Component<any, any> {
    constructor(props) {
        super(props)
        this.state = { 正常样式:this.样式}
    }
    样式: React.CSSProperties = {
            textDecoration: 'none',
            fontSize: '12px',
            left: '10px',
            right: '0',
            color: 颜色.rgb(50,180,50).取值
    }
    经过样式: React.CSSProperties = {
        color: '#ff6a00',
        textDecoration: 'none'
    }
    点击样式: React.CSSProperties = {
        color: '#dd2323',
        textDecoration: 'none'
    }    
    render() {
        return (
            <a style={this.state.正常样式 ? this.state.正常样式 : this.样式}
                onClick={(e) => {
                this.props.单击 ? this.props.单击(e) : {}
            } }
                onMouseDown={(e) => {
                    this.setState({ 正常样式: $.extend({}, this.样式, this.点击样式) })
                } }

                onMouseUp={(e) => {
                    this.setState({ 正常样式: $.extend({}, this.样式, this.经过样式) })
                } }

                onMouseLeave={(e) => {
                    this.setState({ 正常样式: this.样式 })
                } }

                onMouseOver={(e) => {
                    this.setState({ 正常样式: $.extend({}, this.样式, this.经过样式) })
                } }
                >{this.props.链接名}</a>
        )
    }
}

export interface 链接 {
    定位方式?: string,
    x?: string | number,
    y?: string | number,
    宽度?: string | number,
    高度?: string | number,
    单击?: (e) => any,
    圆角?: string | number,
    阴影?: string,
    样式?: React.CSSProperties
}

